Calm overview map markers#15
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughThe changes add shared zoom-based photo marker presentation rules, apply them to map markers and CSS, and expose day selection state through ChangesPhoto marker presentation
Day selection accessibility
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant Map
participant TripLayers
participant PresentationRules
participant MarkerDOM
Map->>TripLayers: Provide current zoom
TripLayers->>PresentationRules: Evaluate zoom and photo count
PresentationRules-->>TripLayers: Return marker class presentation
TripLayers->>MarkerDOM: Create or update marker classes
Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
components/TripLayers.tsx (1)
344-347: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueConsider simplifying the
isOverviewcheck for existing markers.
isOverviewdepends solely onzoom, notcount— thecountargument passed tophotoMarkerPresentationhere has no effect on the returnedisOverviewvalue. Calling the full function (which also builds a className string) to read one zoom-only boolean is slightly misleading and wasteful. ImportingPHOTO_MARKER_OVERVIEW_ZOOMand comparing directly would be clearer.♻️ Optional simplification
} else { const marker = markers.get(key); - marker?.getElement().classList.toggle("lofoten-photo-marker-overview", photoMarkerPresentation(zoom, isCluster ? Number(feature.properties?.point_count) : 1).isOverview); + marker?.getElement().classList.toggle("lofoten-photo-marker-overview", Number.isFinite(zoom) && zoom < PHOTO_MARKER_OVERVIEW_ZOOM); if (key !== draggingKey) marker?.setLngLat(coordinates); }This would require adding
PHOTO_MARKER_OVERVIEW_ZOOMto the existing import on line 7.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@components/TripLayers.tsx` around lines 344 - 347, In the existing-marker branch of TripLayers, replace the photoMarkerPresentation call used only for isOverview with a direct zoom comparison against PHOTO_MARKER_OVERVIEW_ZOOM. Add that constant to the existing import, and preserve the current class toggle and marker-position behavior.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@components/TripLayers.tsx`:
- Around line 344-347: In the existing-marker branch of TripLayers, replace the
photoMarkerPresentation call used only for isOverview with a direct zoom
comparison against PHOTO_MARKER_OVERVIEW_ZOOM. Add that constant to the existing
import, and preserve the current class toggle and marker-position behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: e202b663-4e85-43e2-9a6e-8a4e6da2c72f
📒 Files selected for processing (6)
components/DaySidebar.tsxcomponents/TripLayers.tsxcomponents/map-overrides.csse2e/trip.spec.tslib/map-presentation.test.tslib/map-presentation.ts
What changed
aria-pressedWhy
The complete trip contains hundreds of media items. At overview zooms, large thumbnail cards competed with the route and geography. This keeps the archive visible while making the map easier to read.
Validation
npm run lint(0 errors; one pre-existing hook dependency warning)npm run typechecknpm test(216 tests)npm run test:e2e(7 tests)git diff --checkManual smoke test
Open the real Mapbox-backed trip at whole-trip zoom, then zoom past level 12. Confirm overview markers are quieter, detail markers expand, clusters still open, photo popups work, and owner drag behavior is unchanged.
Summary by CodeRabbit
Accessibility
Improvements
Tests